import React, { forwardRef, useImperativeHandle, useState } from 'react';

import { Button, DatePicker, Form, Input, Modal, Radio, Tag , Select,InputNumber,message,Row,Col} from 'antd';
import { modalLayoutLg, modalLayoutSm } from '@/config/layout';
import { request } from 'umi';
const DepartmentModal = (props: any, refs: any) => {
  const [form] = Form.useForm();
  // const [fileList,setfileList] = useState([]);
  const [measureClassData, setmeasureClassData] = useState([]);
  const { setFieldsValue, resetFields } = form;
  const [code, setCode] = useState('');
  const [isModalVisible, setIsModalVisible] = useState(false);

  //显示弹窗
  const showModal = () => {
    setIsModalVisible(true);
  };

  //取消
  const handleCancel = () => {
    setIsModalVisible(false);
    setCode('');
    resetFields();
    props.callback && props.callback();
  };
  //确定
  const handleOk = () => {
    form
      .validateFields()
      .then((vals) => {
        let Obj = form.getFieldsValue();
        Obj = {
          ...Obj,
          
        };
     
        const url = code ? "/sys/department/edit" : "/sys/department/add";
        if (code) {
          Obj.id = code;
        } else {
        }
        request(url, {
          method: 'POST',
          headers: {
            'Content-Type': 'application/json',
          },
          data:Obj
        }).then((res)=>{
          message.success(res?.meta?.msg);
          setIsModalVisible(false);
          handleCancel();
        })
      })
      .catch((info) => {});
  };

  const getDetail = (id: any) => {
    request( "/sys/department/queryById?id="+id, {
      method: 'GET',
      headers: {
        'Content-Type': 'application/json',
      },
      data:{
        id
      }
    }).then((res)=>{
      setFieldsValue(res?.data);
      showModal();
    })

   
  };
  useImperativeHandle(refs, () => ({
    init: (id: any, record: any) => {
      if (id) {
        setCode(id);
        getDetail(id)
        
      } else {
        resetFields();
        showModal();
      }
      
      // setfileList([]);
    },
  }));

  return (
    <>
      <Modal
        title={code === '' ? '新增' : '编辑'}
        visible={isModalVisible}
        onOk={handleOk}
        onCancel={handleCancel}
        centered
        width={1000}
        maskClosable={false}
        bodyStyle={{
          maxHeight: window.innerHeight - 150,
          overflowY: 'auto',
        }}
      >
        <Form form={form} layout="vertical" {...modalLayoutSm}>
          <Row>
            <Col span={12}>
              <Form.Item  label="机构编号" name="code"
                rules={[{ required: true, message: '请输入机构编号!' }]}
              >
                  <Input />
              </Form.Item>
            </Col>
            <Col span={12}>
              <Form.Item  label="公司名称" name="name"
                rules={[{ required: true, message: '请输入公司名称!' }]}
              >
                  <Input />
              </Form.Item>
            </Col>
            <Col span={12}>
              <Form.Item  label="归属公司ID" name="officeId"
                rules={[{ required: true, message: '请输入归属公司ID!' }]}
              >
                  <Input />
              </Form.Item>
            </Col>
            <Col span={12}>
              <Form.Item  label="父级部门ID" name="parentId"
                rules={[{ required: true, message: '请输入父级部门ID!' }]}
              >
                  <Input />
              </Form.Item>
            </Col>
            <Col span={12}>
              <Form.Item  label="删除标记;0-未删除；1-已删除" name="delFlag"
                rules={[{ required: true, message: '请输入删除标记;0-未删除；1-已删除!' }]}
              >
                  <Input />
              </Form.Item>
            </Col>
            <Col span={12}>
              <Form.Item  label="乐观锁" name="revision"
                rules={[{ required: true, message: '请输入乐观锁!' }]}
              >
                  <InputNumber style={{width:'100%'}}/>
              </Form.Item>
            </Col>
            <Col span={12}>
              <Form.Item  label="创建人" name="idCreate"
                rules={[{ required: true, message: '请输入创建人!' }]}
              >
                  <Input />
              </Form.Item>
            </Col>
            <Col span={12}>
              <Form.Item  label="创建时间" name="gmtCreate"
                rules={[{ required: true, message: '请输入创建时间!' }]}
              >
                  <DatePicker showTime style={{width:'100%'}}/>
              </Form.Item>
            </Col>
            <Col span={12}>
              <Form.Item  label="更新人" name="idModified"
                rules={[{ required: true, message: '请输入更新人!' }]}
              >
                  <Input />
              </Form.Item>
            </Col>
            <Col span={12}>
              <Form.Item  label="更新时间" name="gmtModified"
                rules={[{ required: true, message: '请输入更新时间!' }]}
              >
                  <DatePicker showTime style={{width:'100%'}}/>
              </Form.Item>
            </Col>
          </Row>
        </Form>
      </Modal>
    </>
  );
};
const AddMCom = forwardRef(DepartmentModal);

export default AddMCom;
